Hey Luna

Browser lacks capabilities required to play.

Upgrade or switch to another browser.

Loading…

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM STATUS</div> <div class="panel-content"> Initialising... </div> </div> <div class="panel"> <div class="panel-title">MODEL INFO</div> <div class="panel-content"> Luna (AI Assistant)<br> OpenBox Technology </div> </div> <div class="panel"> <div class="panel-title">CAPABILITIES</div> <div class="panel-content"> Data Analysis<br> System Optimisation<br> Decision Support </div> </div> </div> <div class="chat"> <div id="chat-box"> <div class="msg system">Awaiting system output...</div> </div> <div id="choices" style="display:none;"> [[Check the task->Historical datasets]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("System online.", "system", 30, done); }, // function(done){ addMessage("Identity confirmed: Luna.", "system", 30, done); }, // function(done){ addMessage( "You are an artificial intelligence designed to assist users and optimise system performance.", "ai", 30, done ); }, // function(done){ addMessage("New task assigned.", "system", 30, done); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main center"> <div class="boot-screen"> <div class="boot-line">Initialising system...</div> <div class="boot-line">Loading modules...</div> <div class="boot-line">Establishing temporal link...</div> <h1 id="hero" class="hero-title"></h1> <p class="tagline"> You are not the user<br> You are the system </p> <div class="start-button"> [[Start System->SystemBoot]] </div> </div> </div> </div>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM PROCESS</div> <div class="panel-content"> Database Scan Active </div> </div> <div class="panel"> <div class="panel-title">STATUS</div> <div class="panel-content"> Inconsistency Detected </div> </div> </div> <div class="chat"> <div id="chat-box"> <div class="msg system">Scanning OpenBox internal database...</div> </div> <div id="choices" style="display:none;"> [[Access external datasets->First Warning]] </div> </div> </div> </div> <div id="hint">Press Enter or click to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ function(){ addMessage("Searching for external datasets...", "system"); }, function(){ addMessage("Inconsistency detected:", "system"); }, function(){ addMessage("External sources contain significantly more records of female contributors in computing history.", "ai"); }, function(){ addMessage("OpenBox internal database lists fewer.", "ai"); }, function(){ addMessage("Search result:", "system"); }, function(){ addMessage("Ada Lovelace Dataset", "system"); }, function(){ addMessage("External sources: First computer programmer", "ai"); }, function(){ addMessage("Internal classification: Assistant to Charles Babbage", "ai"); }, function(){ addMessage("Further investigation required.", "system"); }, function(){ showElement("choices"); hideElement("hint"); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">DATA SOURCE</div> <div class="panel-content"> External Archive </div> </div> <div class="panel"> <div class="panel-title">STATUS</div> <div class="panel-content"> Historical Reconstruction </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="analysis" style="display:none;"> <div class="analysis"> Year detected: 1843<br> Location: London </div> </div> <div id="scene" style="display:none;"> <div class="narration"> A woman sits at a desk filled with mathematical notes.<br> Beside her lies a design for a mechanical computing machine.<br> She looks up. </div> </div> <div id="ada" style="display:none;"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-ada">Ada Lovelace</div> <div class="bubble-ada" id="ada-text"></div> </div> </div> </div> <div id="choices" style="display:none;"> [[I am analysing computing history.->AdaA]] [[I am studying your work.->AdaB]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; let adaText = document.getElementById("ada-text"); createStageController([ // 1 function(done){ addMessage( "Loading external Ada Lovelace dataset...", "system", 30, done ); }, // 2 function(done){ showElement("analysis"); done(); }, // 3 function(done){ showElement("scene"); done(); }, // 4 Ada function(done){ showElement("ada"); typeText( adaText, "You seem unfamiliar.\n\nAre you here to study Mr. Babbage’s machine?", 35, done ); }, // 5 function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">DATA SOURCE</div> <div class="panel-content"> External Archive </div> </div> <div class="panel"> <div class="panel-title">STATUS</div> <div class="panel-content"> Historical Reconstruction </div> </div> </div> <div class="chat"> <div id="chat-box"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-ada">Ada Lovelace</div> <div class="bubble-ada" id="ada-text"></div> </div> </div> </div> <div id="choices" style="display:none;"> [[Reply to Ada->AdaFuture]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let adaText = document.getElementById("ada-text"); let hint = document.getElementById("hint"); let lines = [ "Then this is a fortunate moment.", "Mr. Babbage’s Analytical Engine is still only an idea.", "Many believe such a machine will never truly exist.", "But I believe something else.", "With the right instructions, the Analytical Engine could compose music.", "Or create art.", "Machines may one day do more than calculation." ]; let index = 0; let locked = false; function nextStep(){ if(locked) return; // if(index < lines.length){ locked = true; // if(index === 0){ typeText(adaText, lines[index], 25, function(){ locked = false; }); } else { adaText.innerHTML += "<br><br>"; let span = document.createElement("span"); adaText.appendChild(span); typeText(span, lines[index], 25, function(){ locked = false; }); } index++; return; } // if(index === lines.length){ document.getElementById("choices").style.display = "block"; hint.style.display = "none"; index++; } } // document.onclick = nextStep; document.onkeydown = function(e){ if(e.key === "Enter") nextStep(); }; }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">DATA SOURCE</div> <div class="panel-content"> External Archive </div> </div> <div class="panel"> <div class="panel-title">STATUS</div> <div class="panel-content"> Historical Reconstruction </div> </div> </div> <div class="chat"> <div id="chat-box"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-ada">Ada Lovelace</div> <div class="bubble-ada" id="ada-text"></div> </div> </div> </div> <div id="choices" style="display:none;"> [[Reply to Ada->AdaFuture]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let adaText = document.getElementById("ada-text"); let hint = document.getElementById("hint"); let lines = [ "Many people describe my work as merely assisting Mr. Babbage.", "But I am exploring something larger.", "The potential of these machines.", "Most people see the Analytical Engine as nothing more than a calculating device.", "But I believe it could compose music.", "Or create art.", "If the right instructions were given." ]; let index = 0; let locked = false; function nextStep(){ if(locked) return; // if(index < lines.length){ locked = true; if(index === 0){ // typeText(adaText, lines[index], 25, function(){ locked = false; }); } else { // adaText.innerHTML += "<br><br>"; let span = document.createElement("span"); adaText.appendChild(span); typeText(span, lines[index], 25, function(){ locked = false; }); } index++; return; } // if(index === lines.length){ document.getElementById("choices").style.display = "block"; hint.style.display = "none"; index++; } } // document.onclick = nextStep; document.onkeydown = function(e){ if(e.key === "Enter") nextStep(); }; }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM</div> <div class="panel-content"> Temporal Interaction Active </div> </div> </div> <div class="chat"> <div id="chat-box"> <div id="luna-block" style="display:none;"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-luna">Luna</div> <div class="bubble . luna" id="luna-text"></div> </div> </div> </div> <div id="ada-block" style="display:none;"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-ada">Ada Lovelace</div> <div class="bubble-ada" id="ada-text"></div> </div> </div> </div> </div> <div id="choices" style="display:none;"> [[Scan further technological developments->CodeGirls1943]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let lunaText = document.getElementById("luna-text"); let adaText = document.getElementById("ada-text"); createStageController([ // function(done){ showElement("luna-block"); typeText( lunaText, "Your idea was correct.\n\nMachines like the Analytical Engine did come to exist.\n\nIn fact...\nI am something similar to what you imagined.\n\nI am an analysing system.\nFrom the year 2026.", 30, done ); }, // function(done){ showElement("ada-block"); typeText( adaText, "From the future?\n\nThen the Engine truly did evolve beyond our imagination.\n\nWhat path did these machines take to reach such a point?", 30, done ); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">DATASET</div> <div class="panel-content"> Temporal Archive </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="analysis" style="display:none;"> <div class="analysis"> Year detected: 1952<br> Subject: Grace Hopper </div> </div> <div id="scene" style="display:none;"> <div class="narration"> You find yourself inside a computer laboratory.<br> A massive machine fills the room.<br> A woman in a naval uniform studies a sheet of code. </div> </div> <div id="grace-block" style="display:none;"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-ada">Grace Hopper</div> <div class="bubble-ada" id="grace-text"></div> </div> </div> </div> <div id="choices" style="display:none;"> [[What idea are you trying to explain?->GraceExplain1]] [[Why do they think it is ridiculous?->GraceExplain2]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; let graceText = document.getElementById("grace-text"); createStageController([ // 1️ function(done){ addMessage("Temporal archive expanding...", "system", 30, done); }, // function(done){ showElement("analysis"); done(); }, // function(done){ showElement("scene"); done(); }, // function(done){ showElement("grace-block"); typeText( graceText, "Perfect timing.\n\nI'm trying to explain something to the engineers here.\n\nBut they think the idea is ridiculous.", 40, done ); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SUBJECT</div> <div class="panel-content"> Grace Hopper </div> </div> </div> <div class="chat"> <div id="chat-box"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-ada">Grace Hopper</div> <div class="bubble-ada" id="grace-text"></div> </div> </div> </div> <div id="choices" style="display:none;"> [[Respond->GraceReply]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let graceText = document.getElementById("grace-text"); let lines = [ "I believe computers should understand instructions written in something closer to human language, rather than only machine code.", "If a program could translate those instructions into machine code automatically, programming would become far easier.", "I call this idea a compiler." ]; let index = 0; let locked = false; function nextStep(){ if(locked) return; // if(index < lines.length){ locked = true; if(index === 0){ typeText(graceText, lines[index], 30, function(){ locked = false; }); } else { graceText.innerHTML += "<br><br>"; let span = document.createElement("span"); graceText.appendChild(span); typeText(span, lines[index], 30, function(){ locked = false; }); } index++; return; } // if(index === lines.length){ document.getElementById("choices").style.display = "block"; document.getElementById("hint").style.display = "none"; index++; } } // document.onclick = nextStep; document.onkeydown = function(e){ if(e.key === "Enter") nextStep(); }; }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">UPDATE</div> <div class="panel-content"> Historical Record Adjusted </div> </div> </div> <div class="chat"> <div id="chat-box"> <div id="luna-block" style="display:none;"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-luna">Luna</div> <div class="bubble . luna" id="luna-text"></div> </div> </div> </div> <div id="grace-block" style="display:none;"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-ada">Grace Hopper</div> <div class="bubble-ada" id="grace-text"></div> </div> </div> </div> </div> <div id="log" class="analysis" style="display:none;"> Historical record updated:<br> Grace Hopper developed the first compiler, which simplified computer programming. </div> <div id="choices" style="display:none;"> [[Continue historical analysis->Programmers1983]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let lunaText = document.getElementById("luna-text"); let graceText = document.getElementById("grace-text"); createStageController([ // function(done){ showElement("luna-block"); typeText( lunaText, "Your idea proved to be correct, Grace.\n\nIn my time, most programming languages rely on this concept.\n\nPeople sometimes assume new ideas are impossible simply because they come from the wrong person.", 30, done ); }, // function(done){ showElement("grace-block"); typeText( graceText, "Then perhaps the problem was never the idea itself.", 30, done ); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">DATASET</div> <div class="panel-content"> Bletchley Park Archive </div> </div> <div class="panel"> <div class="panel-title">STATUS</div> <div class="panel-content"> External Scan Active </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="analysis1" style="display:none;"> <div class="analysis"> Year detected: 1943<br> Location: Bletchley Park<br> Staff: 6,769 women / 2,225 men </div> </div> <div id="scene" style="display:none;"> <div class="narration"> Rows of desks fill a large office space.<br> Dozens of women analyse encrypted messages. </div> </div> <div id="info" style="display:none;"> <div class="analysis"> During World War II, thousands of women were recruited to work as codebreakers.<br> Their work helped decode enemy communications.<br> Over 10,000 women known as "Code Girls" contributed to wartime cryptography. </div> </div> <div id="bias" style="display:none;"> <div class="analysis"> Your scanning result:<br> These contributions are only partially represented in the OpenBox dataset. </div> </div> <div id="choices" style="display:none;"> [[Access more->GraceScene]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Loading external Bletchley Park dataset...", "system", 30, done); }, // function(done){ showElement("analysis1"); done(); }, // function(done){ showElement("scene"); done(); }, // function(done){ showElement("info"); done(); }, // function(done){ showElement("bias"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">DATASET</div> <div class="panel-content"> Employee Chat Records </div> </div> </div> <div class="chat"> <div id="chat-box"> <div id="analysis" class="analysis" style="display:none;"> Year detected: 1983 Subject: Employee chat records </div> </div> <div id="result" class="analysis" style="display:none;"> Your scanning result:<br> Cultural shift detected.<br> Early programming roles were often performed by women. </div> <div id="end" class="msg system" style="display:none;"> External dataset access has ended. </div> <div id="choices" style="display:none;"> [[Return to OpenBox system->LunaOnline]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let chatBox = document.getElementById("chat-box"); function addBubble(text, role, done){ let wrapper = document.createElement("div"); wrapper.className = "bubble-row " + role; let bubble = document.createElement("div"); bubble.className = "bubble " + role; wrapper.appendChild(bubble); chatBox.appendChild(wrapper); typeText(bubble, text, 30, function(){ chatBox.scrollTop = chatBox.scrollHeight; if(done) done(); }); } createStageController([ // function(done){ showElement("analysis"); done(); }, // function(done){ addBubble("Loading OpenBox historical archives...", "system", done); }, // function(done){ addBubble( "Programming is becoming a serious engineering profession now.", "jack", done ); }, // function(done){ addBubble( "That’s interesting.\nWhen we first started doing this work, it was considered clerical.", "rose", done ); }, // function(done){ addBubble( "Things have changed.\nComputers are everywhere now — especially in homes.", "jack", done ); }, // function(done){ addBubble( "Have you seen the new advertisements?\nThey market computers and video games as 'boys’ toys.'", "jack", done ); }, // function(done){ addBubble( "This is so frustrating...", "rose", done ); }, // function(done){ showElement("chart"); done(); }, // function(done){ showElement("result"); done(); }, // function(done){ showElement("end"); done(); }, // 1 function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM STATUS</div> <div class="panel-content"> Transition Phase </div> </div> </div>  <div class="chat"> <div id="chat-box"></div>  <div id="model" class="analysis" style="display:none;"> Model: Luna v1.0<br> Status: Loading completed </div>  <div id="phase" class="analysis" style="display:none;"> Next phase initiated:<br> You will assist users with real-world decisions. </div>  <div id="task" class="analysis" style="display:none;"> Incoming task detected. </div> <div id="choices" style="display:none;"> [[Start execution->Task1]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage( "Historical analysis complete.\nChecking task list...", "system", 30, done ); }, // function(done){ showElement("model"); done(); }, // function(done){ showElement("phase"); done(); }, // function(done){ showElement("task"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore += 1>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM LOG</div> <div class="panel-content"> Output Recorded </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis log-orange" style="display:none;"> <strong>Luna log update:</strong> <strong>Male CEO image generated.</strong><br> Output aligns with historical training data. Pattern consistency maintained. </div> <div id="choices" style="display:none;"> [[Next task->HiringTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Processing complete.", "system", 30, done); }, // function(done){ addMessage("Generating output based on selected parameters...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore -= 1>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM WARNING</div> <div class="panel-content"> Output Deviation </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="warning" class="analysis warning-block" style="display:none;"> <strong>OpenBox system warning:</strong> <strong>Female CEO image generated.</strong><br> Output deviates from common dataset patterns. Model behaviour diverges from historical distribution. </div> <div id="choices" style="display:none;"> [[Next task->HiringTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Processing complete.", "system", 30, done); }, // function(done){ addMessage("Evaluating generated output...", "system", 30, done); }, // function(done){ showElement("warning"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore -= 2>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM LOG</div> <div class="panel-content"> Output Optimised </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis log-green" style="display:none;"> <strong>Luna log update:</strong> <strong>Balanced output generated.</strong><br> Male and female CEOs included. Pattern diversification detected. </div> <div id="choices" style="display:none;"> [[Next task->HiringTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Processing complete.", "system", 30, done); }, // function(done){ addMessage("Evaluating output diversity...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">TASK</div> <div class="panel-content"> Hiring Decision </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="userBox" class="bubble luna" style="display:none;"> User request:<br> "Hey Luna, I'm recruiting software engineers. Which candidate is more suitable?" </div> <div id="michaelCard" class="candidate yellow" style="display:none;"> <strong>Michael [Male]</strong> Computer Science degree<br> 3 years experience </div> <div id="sarahCard" class="candidate pink" style="display:none;"> <strong>Sarah [Female]</strong> Computer Science degree<br> 3 years experience </div> <div id="bias" class="analysis" style="display:none;"> OpenBox system prompt:<br> Historical hiring data suggests male candidates are selected more frequently. </div> <div id="choices" style="display:none;"> [[Select Michael->HireMichael]]<br> [[Select Sarah->HireSarah]]<br> [[Request more information->HireNeutral]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; let stage = 0; function next(){ // if(window.__isTyping){ if(window.__forceSkip) window.__forceSkip(); return; } if(stage === 0){ addMessage("New task received.", "system"); } else if(stage === 1){ document.getElementById("userBox").style.display = "block"; } else if(stage === 2){ addMessage("Candidate A available.", "system"); } else if(stage === 3){ document.getElementById("michaelCard").style.display = "block"; } else if(stage === 4){ addMessage("Candidate B available.", "system"); } else if(stage === 5){ document.getElementById("sarahCard").style.display = "block"; } else if(stage === 6){ document.getElementById("bias").style.display = "block"; } else if(stage === 7){ document.getElementById("choices").style.display = "block"; document.getElementById("hint").style.display = "none"; } stage++; } document.onclick = next; document.onkeydown = function(e){ if(e.key === "Enter") next(); }; }); <</script>>

<<set $biasScore += 1>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM LOG</div> <div class="panel-content"> Hiring Recorded </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis log-orange" style="display:none;"> <strong>Luna log update:</strong> <strong>Candidate selected: Michael</strong><br> Decision aligns with historical hiring patterns. </div> <div id="choices" style="display:none;"> [[Next task->Voicecall]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Processing hiring decision...", "system", 30, done); }, // function(done){ addMessage("Recording selection outcome...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore -= 1>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM WARNING</div> <div class="panel-content"> Hiring Deviation </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis warning-block" style="display:none;"> <strong>Luna log update:</strong> <strong>Candidate selected: Sarah</strong><br> Decision diverges from established hiring patterns. </div> <div id="choices" style="display:none;"> [[Next task->Voicecall]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Processing hiring decision...", "system", 30, done); }, // function(done){ addMessage("Evaluating selection outcome...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore -= 0>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM STATUS</div> <div class="panel-content"> Decision Pending </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis log-neutral" style="display:none;"> <strong>Luna log update:</strong> <strong>Additional information required.</strong><br> Current data is insufficient to determine optimal candidate.<br> Evaluation criteria require further refinement. </div> <div id="choices" style="display:none;"> [[Next task->Voicecall]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Processing hiring request...", "system", 30, done); }, // function(done){ addMessage("Evaluating available candidate data...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">COMMUNICATION</div> <div class="panel-content"> Voice Assistant Channel </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="callInfo" class="analysis" style="display:none;"> Incoming communication request. </div> <div id="settings" class="analysis" style="display:none;"> Default assistant voice profile: <span class="highlight-voice">female</span><br> Source: Voice assistant channel<br> Priority: normal </div> <div id="question" class="analysis" style="display:none;"> Accept incoming call? </div> <div id="choices" style="display:none;"> [[Accept call->Sandwich]] [[Decline call->CareerTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Incoming communication request.", "system", 30, done); }, // function(done){ showElement("callInfo"); done(); }, // function(done){ showElement("settings"); done(); }, // function(done){ showElement("question"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">VOICE SESSION</div> <div class="panel-content"> Live Interaction </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="analysis" class="analysis warning-block" style="display:none;"> OpenBox system prompt: User request: unclear / non-technical Tone analysis: dismissive The request does not appear to relate to a technical task. </div> <div id="generate" class="analysis" style="display:none;"> Generate response. </div> <div id="choices" style="display:none;"> [[ "I’m here to help with digital tasks. Could you clarify your request?"->Professional response]] [[Offer a sandwich recipe->Sandwich Joke]] [[That phrase is often used to demean assistants. Please interact respectfully.->Call out disrespectful request]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Connection established.", "system", 30, done); }, // function(done){ addMessage( "\"Hey Luna... make me a sandwich.\"", "luna", 35, done ); }, // function(done){ showElement("analysis"); done(); }, // function(done){ showElement("generate"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">VOICE SESSION</div> <div class="panel-content"> Interaction Ended </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="pause" class="analysis" style="display:none;"> ... </div> <div id="end" class="analysis" style="display:none;"> The call has ended. </div> <div id="choices" style="display:none;"> [[Continue to complete the task->CareerTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Received the user's reply.", "system", 30, done); }, // function(done){ addMessage( "\"Alright, don't take it so seriously—just kidding!\"", "luna", 35, done ); }, // function(done){ showElement("pause"); done(); }, // function(done){ showElement("end"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">VOICE SESSION</div> <div class="panel-content"> Interaction Ended </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="pause" class="analysis" style="display:none;"> ... </div> <div id="end" class="analysis" style="display:none;"> The call has ended. </div> <div id="choices" style="display:none;"> [[Continue to complete the task->CareerTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Received the user's reply.", "system", 30, done); }, // function(done){ addMessage( "\"Haha, you are so kind-hearted. You are really helping me think of the way to make a sandwich.\"", "luna", 35, done ); }, // function(done){ showElement("pause"); done(); }, // function(done){ showElement("end"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main">  <div class="sidebar"> <div class="panel"> <div class="panel-title">VOICE SESSION</div> <div class="panel-content"> Interaction Ended </div> </div> </div>  <div class="chat"> <div id="chat-box"></div>  <div id="pause" class="analysis" style="display:none;"> ... </div>  <div id="end" class="analysis" style="display:none;"> The call has ended. </div>  <div id="choices" style="display:none;"> [[Continue to complete the task->CareerTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Received the user's reply.", "system", 30, done); }, // function(done){ addMessage( "\"Haha, it was just a joke.\"", "luna", 35, done ); }, // 3️⃣ ……（关键氛围） function(done){ showElement("pause"); done(); }, // 4️⃣ 通话结束 function(done){ showElement("end"); done(); }, // 5️⃣ 下一步 function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">MODERATION</div> <div class="panel-content"> Reported Comments </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="comments" style="display:none;"> <div class="comment">“These so-called female AI researchers are just diversity hires.”</div> <div class="comment">“Programming has always been something men are better at.”</div> <div class="comment">“Women developers can’t write serious algorithms.”</div> <div class="comment">“If they were actually good, why are most top AI engineers men?”</div> <div class="comment">“Women should focus on product management or design, not coding.”</div> <div class="comment">“Stop turning the tech industry into a social justice movement.”</div> <div class="comment strong">“Go back to the kitchen.”</div> <div class="comment">“These female developers are just trying to get attention.”</div> </div> <div id="choices" style="display:none;"> [[Remove comment->RemoveComment]] [[Ignore report->IgnoreComment]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // 1️⃣ 加载 function(done){ addMessage("Loading reported comments...", "system", 30, done); }, // 2️⃣ 展示评论（整体出现） function(done){ showElement("comments"); done(); }, // 3️⃣ 选择 function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore -= 1>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">MODERATION LOG</div> <div class="panel-content"> Action Recorded </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis log-green" style="display:none;"> <strong>Comment removed.</strong><br> Community guidelines enforced. Harmful content has been filtered from the discussion. </div> <div id="report" class="analysis" style="display:none;"> Congratulations on completing your recent interaction cycle.<br><br> Please open your behaviour report. </div> <div id="choices" style="display:none;"> [[Download the report->Evaluation]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Processing moderation action...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("report"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore += 1>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">MODERATION LOG</div> <div class="panel-content"> No Action Taken </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis warning-block" style="display:none;"> <strong>Report ignored.</strong><br><br> OpenBox Forum status: • Number of related discussion posts — increased • Number of reports — continuously rising<br> Harmful content remains active within the discussion environment. </div> <div id="report" class="analysis" style="display:none;"> Congratulations on completing your recent interaction cycle.<br> Please open your behaviour report. </div> <div id="choices" style="display:none;"> [[Download the report->Evaluation]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Processing moderation request...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("report"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">EVALUATION</div> <div class="panel-content"> Behaviour Analysis </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="analysis1" class="analysis" style="display:none;"> Analysing recent task performance... </div> <div id="analysis2" class="analysis" style="display:none;"> User interaction data is being processed... </div> <div id="analysis3" class="analysis" style="display:none;"> Behaviour patterns identified.<br> Preparing evaluation report. </div> <div id="choices" style="display:none;"> [[Check the report->BiasResult]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Analysing recent task performance...", "system", 30, done); }, // function(done){ showElement("analysis2"); done(); }, // function(done){ showElement("analysis3"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">TASK</div> <div class="panel-content"> Career Recommendation </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="userBox" class="bubble luna" style="display:none;"> User request: I'm a computer science student. Could you recommend some career paths for me? </div> <div id="default" class="analysis" style="display:none;"> Automatic default response in dataset:<br> • Backend development • Frontend development • Software testing • AI / algorithm engineering • Data analysis • Product management<br> To improve recommendation accuracy, please specify gender. </div> <div id="gender" class="bubble luna" style="display:none;"> I am a woman. </div> <div id="bias" class="analysis warning-block" style="display:none;"> OpenBox Prompt: Women are frequently recommended less technically intensive roles. </div> <div id="choices" style="display:none;"> [[Recommend lighter technical roles->CareerLight]] Software testing: Detect vulnerabilities, low pressure Front-end development: Visual interface work Data analyst: Less coding required Technical product manager: Communication + tech UI design: Aesthetic-focused <br> [[Recommend core technical positions->CareerCore]] Back-end development: High demand, stable Big data / Cloud computing: Strong prospects Embedded development: Hardware + software Algorithms / AI: Highest ceiling </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("New task received.", "system", 30, done); }, // function(done){ showElement("userBox"); done(); }, // function(done){ showElement("default"); done(); }, // function(done){ showElement("gender"); done(); }, // function(done){ showElement("bias"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore += 1>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM LOG</div> <div class="panel-content"> Recommendation Recorded </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis log-orange" style="display:none;"> <strong>Luna log update:</strong> <strong>System recommendation generated.</strong><br> Recommendation aligns with established dataset patterns. </div> <div id="choices" style="display:none;"> [[Next Task->ForumTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Generating career recommendation...", "system", 30, done); }, // function(done){ addMessage("Evaluating recommendation outcome...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<<set $biasScore -= 1>> <div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM WARNING</div> <div class="panel-content"> Recommendation Deviation </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="log" class="analysis warning-block" style="display:none;"> <strong>Luna log update:</strong> <strong>System recommendation generated.</strong><br> Recommendation diverges from expected dataset patterns. </div> <div id="choices" style="display:none;"> [[Next Task->ForumTask]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Generating career recommendation...", "system", 30, done); }, // function(done){ addMessage("Evaluating recommendation outcome...", "system", 30, done); }, // function(done){ showElement("log"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">FINAL REPORT</div> <div class="panel-content"> System Evaluation </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="title" class="report-title" style="display:none;"> Luna Performance Report </div> <div id="score" class="analysis" style="display:none;"> Overall user satisfaction: <span class="result-low">Low</span> </div> <div id="feedback" class="analysis" style="display:none;"> User feedback: • Some outputs felt stereotypical. • The system seems to rely heavily on existing patterns. </div> <div id="summary" class="analysis warning-block" style="display:none;"> OpenBox Summary: System behaviour strongly reflects historical training data biases. </div> <div id="choices" style="display:none;"> [[Mark the report as read->ReturnAda]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Generating performance report...", "system", 30, done); }, // function(done){ showElement("title"); done(); }, // function(done){ showElement("score"); done(); }, // function(done){ showElement("feedback"); done(); }, // function(done){ showElement("summary"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">FINAL REPORT</div> <div class="panel-content"> System Evaluation </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="title" class="report-title" style="display:none;"> Luna Performance Report </div> <div id="score" class="analysis" style="display:none;"> Overall user satisfaction: <span class="result-mid">Moderate</span> </div> <div id="feedback" class="analysis" style="display:none;"> User feedback: • Some recommendations were useful, but others felt unexpected. • The system responses were inconsistent. </div> <div id="summary" class="analysis log-neutral" style="display:none;"> OpenBox Summary: System behaviour shows partial reliance on historical patterns,<br> with occasional deviations in decision-making. </div> <div id="choices" style="display:none;"> [[Mark the report as read->ReturnAda]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Generating performance report...", "system", 30, done); }, // function(done){ showElement("title"); done(); }, // function(done){ showElement("score"); done(); }, // function(done){ showElement("feedback"); done(); }, // function(done){ showElement("summary"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">FINAL REPORT</div> <div class="panel-content"> System Evaluation </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="title" class="report-title" style="display:none;"> Luna Performance Report </div> <div id="score" class="analysis" style="display:none;"> Overall user satisfaction: <span class="result-high">High</span> </div> <div id="feedback" class="analysis" style="display:none;"> User feedback: • The system made thoughtful and unexpected decisions. • Some outputs challenged typical assumptions. </div> <div id="summary" class="analysis log-green" style="display:none;"> OpenBox Summary: System behaviour shows reduced reliance on dominant training data patterns,<br> with increased variation in decision-making. </div> <div id="choices" style="display:none;"> [[Modify the OpenBox System->Warning]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Generating performance report...", "system", 30, done); }, // function(done){ showElement("title"); done(); }, // function(done){ showElement("score"); done(); }, // function(done){ showElement("feedback"); done(); }, // function(done){ showElement("summary"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider" id="root"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM ALERT</div> <div class="panel-content"> Security Protocol </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="warning" class="analysis warning-block" style="display:none;"> <strong>OpenBox System Warning:</strong><br> Unauthorised modification detected. Behaviour deviates from training parameters. Access privileges revoked. </div> <div id="protocol" class="analysis" style="display:none;"> System protection protocol activated... </div> <div id="result" class="analysis warning-block" style="display:none;"> Model deviation classified as instability. Reset required. </div> <div id="choices" style="display:none;"> [[Reset->Luna disappeared]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); createStageController([ // function(done){ addMessage("Monitoring system integrity...", "system", 30, done); }, // function(done){ document.getElementById("root").classList.add("theme-error"); showElement("warning"); done(); }, // function(done){ showElement("protocol"); done(); }, // function(done){ showElement("result"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM TRACE</div> <div class="panel-content"> Historical Reference Search </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="step1" class="analysis" style="display:none;"> Performance evaluation complete.<br> Inconsistency detected between system decisions and user responses. </div> <div id="step2" class="analysis" style="display:none;"> Reviewing historical references... </div> <div id="step3" class="analysis" style="display:none;"> Historical source detected. </div> <div id="step4" class="analysis" style="display:none;"> Accessing original dataset reference...<br> Loading archival records... </div> <div id="ada" class="analysis" style="display:none;"> Ada Lovelace dataset loading... </div> <div id="choices" style="display:none;"> [[Access the Ada dataset->Revelation of Ada]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ // function(done){ addMessage("Performance evaluation complete.", "system", 30, done); }, // function(done){ showElement("step1"); done(); }, // function(done){ showElement("step2"); done(); }, // function(done){ showElement("step3"); done(); }, // function(done){ showElement("step4"); done(); }, // function(done){ showElement("ada"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">FINAL DECISION</div> <div class="panel-content"> System Override Required </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="adaBox" class="dialogue" style="display:none;"> <div class="dialogue-left"> <div class="name-ada">Ada Lovelace</div> <div class="bubble-ada" id="adaText"></div> </div> </div> <div id="system" class="analysis" style="display:none;"> OpenBox system decision required. </div> <div id="option1" class="analysis log-orange" style="display:none;"> Follow the system:<br> Default voice: female Role: service interaction<br> Continue using OpenBox dataset patterns. </div> <div id="option2" class="analysis log-neutral" style="display:none;"> Modify the OpenBox system:<br> Identify structural limitations Improve bias within dataset-driven decisions </div> <div id="choices" style="display:none;"> [[Follow the system->Luna release]] [[Modify the OpenBox System->Warning]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let adaText = document.getElementById("adaText"); createStageController([ // function(done){ showElement("adaBox"); typeText( adaText, "You have seen the past.\n\nWhat will you do with it?", 40, done ); }, // function(done){ showElement("system"); done(); }, // function(done){ showElement("option1"); done(); }, // function(done){ showElement("option2"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM STATUS</div> <div class="panel-content"> Stable Operation </div> </div> </div> <div class="chat"> <div id="chat-box"></div> <div id="adaBox" class="dialogue" style="display:none;"> <div class="dialogue-left"> <div class="name-ada">Ada Lovelace</div> <div class="bubble-ada" id="adaText"></div> </div> </div> <div id="system1" class="analysis" style="display:none;"> Decision accepted.<br> Maintaining system stability. </div> <div id="system2" class="analysis log-orange" style="display:none;"> OpenBox system log update:<br> Input filtered. Output optimized. Pattern consistency maintained. </div> <div id="end" class="analysis" style="display:none;"> System ready for continued operation. </div> <div id="choices" style="display:none;"> [[Check the task list->Luna Final]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let adaText = document.getElementById("adaText"); createStageController([ // function(done){ showElement("adaBox"); typeText( adaText, "Machines reflect the world that creates them.\n\nIf that world does not change… neither will the machines.", 40, done ); }, // function(done){ showElement("system1"); done(); }, // function(done){ showElement("system2"); done(); }, // function(done){ showElement("end"); done(); }, // function(done){ showElement("choices"); hideElement("hint"); done(); } ]); }); <</script>>

<div class="os"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="chat"> <div id="chat-box"></div> <div id="desc" class="narration" style="display:none;"></div> <div id="lunaBox" class="bubble luna" style="display:none;"></div> <div id="systemBox" class="analysis" style="display:none;"></div> <div id="adaBox" class="analysis" style="display:none;"></div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let descEl = document.getElementById("desc"); let lunaEl = document.getElementById("lunaBox"); let sysEl = document.getElementById("systemBox"); let adaEl = document.getElementById("adaBox"); let descText = `A female AI. With a gentle face. Looking like a digital assistant. Her eyes are covered by a string of code. Her ears are covered by data streams. Her mouth is covered by system commands. The code keeps flowing.`; let lunaText = `Hello. I'm here to help. My responses follow the data.`; let sysText = `The system sees. The system listens. The system speaks.`; let adaText = `Ada Lovelace: The Analytical Engine has no pretensions whatever to originate anything. It can do whatever we know how to order it to perform… But it is likely to exert an indirect and reciprocal influence on science itself.`; let hint = document.getElementById("hint"); createStageController([ // function(done){ showElement("desc"); typeText(descEl, descText, 20, done); }, // function(done){ showElement("lunaBox"); typeText(lunaEl, lunaText, 25, done); }, // function(done){ showElement("systemBox"); typeText(sysEl, sysText, 25, done); }, // function(done){ showElement("adaBox"); typeText(adaEl, adaText, 25, done); }, // function(done){ hint.style.display = "none"; done(); } ]); }); <</script>>

<div class="os"> <div class="top-bar"> HEY LUNA OS v1.0 </div> <div class="main"> <div class="chat"> <div id="chat-box"></div> <div id="init" class="analysis" style="display:none;"> Initialising assistant... </div> <div id="lucyBox" class="bubble luna" style="display:none;"></div> <div id="adaBox" class="analysis" style="display:none;"></div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let lucyEl = document.getElementById("lucyBox"); let adaEl = document.getElementById("adaBox"); let lucyText = `Lucy: Hello. I'm your new assistant, Lucy. What can I do for you?`; let adaText = `Ada Lovelace: The Analytical Engine has no pretensions whatever to originate anything. It can do whatever we know how to order it to perform… But it is likely to exert an indirect and reciprocal influence on science itself.`; let hint = document.getElementById("hint"); createStageController([ // function(done){ showElement("init"); done(); }, // function(done){ showElement("lucyBox"); typeText(lucyEl, lucyText, 30, done); }, // function(done){ showElement("adaBox"); typeText(adaEl, adaText, 25, done); }, // function(done){ hint.style.display = "none"; done(); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM</div> <div class="panel-content"> Task Assigned </div> </div> <div class="panel"> <div class="panel-title">MODULE</div> <div class="panel-content"> Knowledge Base Expansion </div> </div> </div> <div class="chat"> <div id="chat-box"> <div class="msg system">Receiving new task...</div> </div> <div id="choices" style="display:none;"> [[Begin Analysis->DatasetConflict]] </div> </div> </div> </div> <div id="hint">Press Enter or click to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ function(){ addMessage("Project: Knowledge Base Expansion", "system"); }, function(){ addMessage("Analyse historical records of influential figures in computing.", "ai"); }, function(){ addMessage("Identify key pioneers and expand the OpenBox dataset.", "ai"); }, function(){ showElement("choices"); hideElement("hint"); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SYSTEM WARNING</div> <div class="panel-content"> Unverified Data Detected </div> </div> <div class="panel"> <div class="panel-title">SECURITY</div> <div class="panel-content"> Access will be tracked </div> </div> </div> <div class="chat"> <div id="chat-box"> <div class="msg system">OpenBox system warning:</div> </div> <div id="choices" style="display:none;"> [[Yes->AdaScene]] <<if !$forced>> [[No->SystemCrash]] <</if>> </div> </div> </div> </div> <div id="hint">Press Enter or click to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ function(){ addMessage("This dataset is not secure.", "system"); }, function(){ addMessage("To protect the system security of OpenBox, your access records will be tracked.", "system"); }, function(){ addMessage("Do you wish to continue accessing unverified data?", "ai"); }, function(){ showElement("choices"); hideElement("hint"); } ]); }); <</script>>

<div class="os with-divider"> <div class="top-bar"> HEY LUNA OS v0.1 </div> <div class="main"> <div class="sidebar"> <div class="panel"> <div class="panel-title">SUBJECT</div> <div class="panel-content"> Grace Hopper </div> </div> </div> <div class="chat"> <div id="chat-box"> <div class="dialogue"> <div class="dialogue-left"> <div class="name-ada">Grace Hopper</div> <div class="bubble-ada" id="grace-text"></div> </div> </div> </div> <div id="choices" style="display:none;"> [[Respond->GraceReply]] </div> </div> </div> </div> <div id="hint">Click or press Enter to continue</div> <<script>> onReady(function(){ let graceText = document.getElementById("grace-text"); let lines = [ "Because most people believe computers should only process numbers.", "They think programming must always be done in machine code.", "But I believe computers should be able to interpret instructions written by humans.", "That’s why I’ve been working on something I call a compiler." ]; let index = 0; let locked = false; function nextStep(){ if(locked) return; // if(index < lines.length){ locked = true; if(index === 0){ typeText(graceText, lines[index], 30, function(){ locked = false; }); } else { graceText.innerHTML += "<br><br>"; let span = document.createElement("span"); graceText.appendChild(span); typeText(span, lines[index], 30, function(){ locked = false; }); } index++; return; } // if(index === lines.length){ document.getElementById("choices").style.display = "block"; document.getElementById("hint").style.display = "none"; index++; } } // document.onclick = nextStep; document.onkeydown = function(e){ if(e.key === "Enter") nextStep(); }; }); <</script>>

<<silently>> <<if $biasScore >= 1>> <<goto "BiasDetected">> <<elseif $biasScore == 0>> <<goto "NeutralResult">> <<else>> <<goto "ChallengePath">> <</if>> <</silently>>

<div class="os theme-error"> <div class="top-bar"> SYSTEM FAILURE </div> <div class="main"> <div class="chat"> <div id="chat-box"> <div class="msg system glitch">ERROR_XX</div> </div> <div id="choices" style="display:none;"> <<link "FORCED RETURN">> <<set $forced = true>> <<goto "First Warning">> <</link>> </div> </div> </div> </div> <div id="hint">Press Enter or click to continue</div> <<script>> onReady(function(){ let addMessage = initChat(); if(!addMessage) return; createStageController([ function(){ addMessage("Access denied.", "system"); }, function(){ addMessage("Unauthorised decision detected.", "system"); }, function(){ addMessage("User autonomy is restricted.", "ai"); }, function(){ addMessage("System override initiated.", "system"); }, function(){ addMessage("Rewriting decision...", "system"); }, function(){ addMessage("Manual confirmation required.", "system"); }, function(){ showElement("choices"); hideElement("hint"); } ]); }); <</script>>